<template>
    <div class="chart-container">
        <chart id="SunburstEchart" :height="data.options.height+'px'" :data="data" :width="data.options.width+'px'" :options="data.options"/>
    </div>
</template>

<script>
import {getNewEcharts} from '@/api/api'
import echart from '@/mixins/echart'
export default {
    name: 'SunburstEchart',
    mixins: [echart],
    created(){
        this.data.options.series.data = [
            {
                name: 'Flora',
                children: [{
                    name: 'Black Tea',
                    value: 1,
                    itemStyle: {
                        color: '#86D560'
                    }
                }, {
                    name: 'Floral',
                    itemStyle: {
                        color: '#AF89D6'
                    },
                    children: [{
                        name: 'Chamomile',
                        value: 1,
                        itemStyle: {
                            color: '#00e473'
                        }
                    }, {
                        name: 'Rose',
                        value: 1,
                        itemStyle: {
                            color: '#59ADF3'
                        }
                    }, {
                        name: 'Jasmine',
                        value: 1,
                        itemStyle: {
                            color: '#009DFF'
                        }
                    }]
                }]
            }
        ]
    },
    methods: {
        _getNewEcharts(){
            const parms = {
                echartType:"tupu",
                sourceId:this.data.options.sourceId
            }
            getNewEcharts(parms).then(res=>{
                if(res.rcode=='0000'){
                    this.data.options.series.data = res.data.tupudata
                }
            })
        }
    }
}
</script>
